// 验证登录
const token = window.localStorage.getItem('token')
const id = window.localStorage.getItem('admin_id')
// 判断 token 和 id 是否存在
if (!token || !id) {
  // 表示你还没有登录过
  // 不需要展示登录后的内容
  alert("未登录")
} else {
  // 表示登录过
  // 我们应该请求用户信息, 把用户昵称展示出来
  getInfo()
}

// 请求用户信息
function getInfo() {
  // 发送请求请求用户信息
  $.ajax({
    url: 'http://localhost:8888/users/info',
    method: 'GET',
    data: { id: id },
    headers: {
      authorization: token
    },
    success (res) {
        $('.adminNickname').find('span').text(res.info.nickname)
    }
  })
}

if (!token || !id) {
  window.location.href = './login.html'
} else {
  // 请求用户数据, 进行渲染
  getCartList()
}

// 获取用户列表
function getCartList() {
  // 发送请求
  $.ajax({
    url: 'http://localhost:8888/adminUser/list',
    method: 'GET',
    data: { id: id },
    headers: { authorization: token },
    success (res) {
      // 判断失败
      if (res.code !== 1) {
        window.location.href = './login.html'
        return
      }

      // 渲染页面
      bindHtml(res)
    }
  })
}

// 渲染页面
function bindHtml(res) {
  let selectNum = 0
  res.getResult.forEach(item => {
    if (item.admin_select) {
      selectNum++
    }
  })
//
  // 渲染页面
  let str = `
    <div class="top">
      <div><p>全选</p> <input id="top_sel" class="selectAll" type="checkbox" ${ selectNum === res.getResult.length ? 'checked' : '' }>
      <label for="top_sel"></label></div>
      <div>用户名</div>
      <div>昵称</div>
      <div>身份</div>
      <div>性别</div>
      <div>年龄</div>
      <div>创建时间</div>
      <div>更新时间</div>
      <div>操作</div>
      <div>操作</div>
    </div>
    <ul class="center">
    `


    res.getResult.forEach(item => {
      str += `
        <li>
          <div class="select">
            <input id="${ item.id }" class="sel" name="sel"${item.admin_select ? 'checked' : ''} type="checkbox" >
            <label for="${ item.id }"></label>
          </div>
          <div class="username">
            ${ item.username}
          </div>
          <div class="nickname">
            ${ item.nickname}
          </div>
          <div class="identity">
            ${ item.identity}
          </div>
          <div class="gender">
            ${ item.gender}
          </div>
          <div class="age">
            ${ item.age}
          </div>
          <div class="createTime">
            ${ item.createTime.substring(0,10)}&nbsp${ item.createTime.substring(11,16)}
          </div>
          <div class="updateTime">
            ${ item.updateTime.substring(0,10)}&nbsp${ item.updateTime.substring(11,16)}
          </div>
          <div class="detail_user">
            <button userId="${ item.id }" class="det">修改</button>
          </div>
          <div class="destory">
            <button id="${ item.id }" class="del" admin_select="${item.admin_select}">删除</button>
          </div>
      `
    })
    str += `
      </li>
    </ul>
    <div class="bottom">
      <p>
        共计 <span>${ selectNum }</span> 位用户
      </p>
      <div class="btns">
        <button class="clear_complete" selectNum="${ selectNum === 0 ? 'false' : 'true' }">删除所有已选中</button>
      </div>
    </div>
  `

  $('.list').html(str)
}

// 各种点击事件
// 修改单一商品选中

$('.list').on('click', '.center .select input', function () {
  //拿到对应的信息发送请求
  $.ajax({
    url: 'http://localhost:8888/adminUser/select',
    method: 'POST',
    headers: { authorization: token },
    data: { id: $(this).attr('id')},
    success (res) {
      console.log(res)
      window.location.reload()
    }
  })

  //从新渲染页面
  getCartList()
})


// 删除单一用户
$('.list').on('click', '.center .del', function (e) {
  e.preventDefault()
  if(Number($(this).attr('admin_select'))===1){
    // 发送请求
    $.ajax({
      url: 'http://localhost:8888/adminUser/remove',
      method: 'GET',
      data: { id: $(this).attr('id') },
      headers: { authorization: token },
      success (res) {
        console.log(res)
        window.location.reload()
      }
    })

    // 重新渲染页面
    getCartList()
  }else{
    alert("未选中")
  }

})

// 全选事件
$('.list').on('click', '.selectAll', function () {
  // 拿到自己的选中状态
  const type = $(this).prop('checked') ? 1 : 0

  // 发送请求进行修改
  $.ajax({
    url: 'http://localhost:8888/adminUser/select/all',
    method: 'POST',
    data: { id: id, type: type },
    headers: { authorization: token },
    success(res){
      window.location.reload()
    }
  })
  getCartList()
})
// 转入用户信息修改
$('.list').on('click', '.center .det', function (e) {
  e.preventDefault()
  window.localStorage.setItem("userId",$(this).attr('userId'));
  window.location.href='./detail_user.html'
})
// 删除所有已选中
$('.list').on('click', '.clear_complete', function (e) {
  e.preventDefault()
  if($(this).attr('selectNum')==='true'){
      //发送请求
      $.ajax({
        url: 'http://localhost:8888/adminUser/remove/select',
        method: 'GET',
        data: { id: id },
        headers: { authorization: token },
        success(res){
          window.location.reload()
        }
      })
    window.location.reload()
    // 重新渲染页面
    getCartList()
  }else{
    alert('未选中')
  }
})
//退出登录
$('button.logout').on('click', function () {
  // 直接发送请求, 请求退出
  $.get('http://localhost:8888/users/logout', { id: id }, res => {
    // 退出登录以后, 直接刷新页面
		window.localStorage.removeItem('token')
		window.localStorage.removeItem('admin_id')
		window.localStorage.removeItem('username')
    window.location.href='./login.html'
  })
})
